<!DOCTYPE html>
<html>
<head>
    <title>简繁体转换 - {$site.name}</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link href="__CDN__/assets/css/frontend.min.css" rel="stylesheet">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
    <![endif]-->

</head>
<body>
<div class="container">
    <h2>简繁体转换</h2>
    <hr>
    <div class="well">
        <div class="row">
            <div class="col-xs-6">
                <div class="form-group">
                    <div class="col-xs-12 col-sm-8">
                        <textarea id="before-text" class="form-control " rows="5" cols="50"></textarea>
                    </div>
                </div>
                <select name="" id="event">
                    <option value="sc2tc">简体转繁体</option>
                    <option value="tc2sc">繁体转简体</option>
                </select>
                <br>
                <button id="convert"> 转换</button>
            </div>
            <div class="col-xs-6">
                <div class="col-xs-12 col-sm-8">
                    <textarea id="after-text" class="form-control " rows="5"  cols="50"></textarea>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-6">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4><i class="fa fa-fw fa-gift"></i> 字符串转换示例</h4>
                </div>
                <div class="panel-body">
                    <h1>简体转繁体: </h1>
                    <h4>$beforeText = '喷泉之所以漂亮是因为她有了压力';</h4>
                    <h4>$afterText = \addons\convert\library\Convert::convert($beforeText,true);</h4>
                    <h4>echo $afterText;</h4>
                    <h4>输出:噴泉之所以漂亮是因爲她有了壓力</h4>
                    <h1>繁体转简体: </h1>
                    <h4>$beforeText = '噴泉之所以漂亮是因爲她有了壓力';</h4>
                    <h4>$afterText = \addons\convert\library\Convert::convert($beforeText,false);</h4>
                    <h4>echo $afterText;</h4>
                    <h4>输出:喷泉之所以漂亮是因为她有了压力</h4>
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4><i class="fa fa-fw fa-gift"></i> 数组转换示例</h4>
                </div>
                <div class="panel-body">
                    <h1>简体转繁体</h1>
                    <h4>
                        <p>$beforeArr = [</p>
                            <p>&nbsp;&nbsp;'喷泉之所以漂亮是因为她有了压力',</p>
                                <p>&nbsp;&nbsp;&nbsp;&nbsp;'text' => [</p>
                                <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'瀑布之所以壮观是因为她没有了退路',</p>
                                <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'水之所以能穿石是因为永远在坚持',</p>
                                <p>&nbsp;&nbsp;&nbsp;&nbsp;],</p>
                        <p>&nbsp;&nbsp;];</p>
                        <p>$afterArr = \addons\convert\library\Convert::arrConvert($beforeArr,true);</p>
                        <p>dump($afterArr);</p>
                    </h4>
                    <h1>繁体转简体</h1>
                    <h4>
                        <p>$beforeArr = [</p>
                        <p>&nbsp;&nbsp;'噴泉之所以漂亮是因爲她有了壓力',</p>
                        <p>&nbsp;&nbsp;&nbsp;&nbsp;'text' => [</p>
                        <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'瀑佈之所以壯觀是因爲她沒有了退路',</p>
                        <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'水之所以能穿石是因爲永遠在堅持',</p>
                        <p>&nbsp;&nbsp;&nbsp;&nbsp;],</p>
                        <p>&nbsp;&nbsp;];</p>
                        <p>$afterArr = \addons\convert\library\Convert::arrConvert($beforeArr,false);</p>
                        <p>dump($afterArr);</p>
                    </h4>
                </div>
            </div>
        </div>
    </div>

</div>
<!-- jQuery -->
<script src="https://cdn.jsdelivr.net/npm/jquery@2.1.4/dist/jquery.min.js"></script>

<!-- Bootstrap Core JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>

<script type="text/javascript">
    $(function () {
        $('#convert').click(function () {
            var text = $('#before-text').val();
            var event = $('#event').val();
            $.post(
                "convert/index/api",
                {
                    text:text,
                    event:event
                },
                function(result){
                    if(result.code == 1){
                        $('#after-text').val(result.data.afterText)
                    }
            });
        })
    });
</script>
</body>
</html>
